<template>
	<view class="hot_good">
			<view class="good_list"  >
				<view class="good_item" v-for="(item,index) in flowList" :key="index"  >
					<view @click="godetail(item._id)">
					<u-lazy-load  :image="item.url" ></u-lazy-load>
					<view class="price">
						<text>￥{{item.total}}</text>
					</view>
					<view class="name">
						{{item.title}}
					</view>
					<view class="content">
						{{item.content}}
					</view>
					</view>
				</view>
			</view>
	</view>
</template>

<script>
	export default {
		data(){
			return{
				flowList:[]
			}
		},
		onLoad() {
			this.getList()
		},
		methods:{
			getList(){
				const db = uniCloud.database() //代码块为cdb
				// 使用uni-clientDB
				db.collection('opendb-news-articles')
				  .where({
				   article_status:0
				  }).get()
				  .then((res)=>{
				   this.flowList=res.result.data
			
				  }).catch((err)=>{
				    console.log(err.code); // 打印错误码
				        console.log(err.message); // 打印错误内容
				  }) 
			},
		}
		
	}
</script>

<style>
	.hot_good{
		background:#eee;
		overflow:hidden;
		margin-top:10px;
		}
		.tit{
			height:50px;
			line-height:50px;
			color:#b50e03;
			text-align:center;
			letter-spacing:20px;
			background:#fff;
			margin:7rpx 0;
			}
		
		.good_list{
			display:flex;
			padding :0 15rpx;
			flex-wrap:wrap ;//换行
			justify-content:space-between;//左右间距
			}
			.good_item{
				background:#fff;
				width:355rpx;
				margin: 10rpx 0;
				padding:15rpx;
				box-sizing:border-box;
				}
				image{
					width:80%;
					height:150px;
					display:block;
					margin:auto;
				}
				.price{
					color:#b50e03;
					font-size:36rpx;
					margin:15rpx 0 5rpx 0; //上右下左
					}
					text:nth-child(2){
						color:#ccc;
						font-size:28rpx;
						margin-left:7rpx;
						text-decoration: line-through;
					}
				
				.name{
					font-size:28rpx;
					line-height:50rpx;
					padding-bottom:15rpx;
					padding-top:10rpx;
				}
			
		
	.grid-text{
		font-size: 10px;;
	}
</style>
